<template>
	<view>
		<!-- <view>新增/修改招聘小组</view> -->
		<view class="cu-form-group">
			<view class="title">* 小组名称</view>
			<input class="input-item text-r" placeholder="请输入小组名称" name="input" v-model="name" />

		</view>
		<view class="form-item cu-form-group">
			<view class="title">* 组长</view>
			<picker @change="groupLeaderChange" :value="index" :range="groupLeader" range-key="name">
				<view class="picker">
					{{groupLeaderCount}}
				</view>
			</picker>
		</view>
		<view class="cu-form-group">
			<view class="uni-list bg-fff pb-10 w100">
				<view class="title">* 组员</view>
				<checkbox-group @change="checkboxChange" class="content-item-con grid col-3">
					<block v-for="(item,index) in crew" :key="index">
						<view class="checkbox-item flex rcs" v-if="item.id != ''">
							<checkbox :value="item.id" :checked="item.checked" />
							<view class="check-title">{{item.name}}</view>
						</view>
					</block>
				</checkbox-group>
			</view>
		</view>

		<view class="flex flex-just">
			<view class="btn-yes" @tap="handleClickYes">确定</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				msg: '',
				check: true,
				checked: false,
				token: '',
				// 小组名称
				name: '',
				groupLeader: [], // 组长
				index: 0,
				groupLeaderName: '',
				crew: [], //组员
				id: '',
				// 后台传的数据
				groupLeader_id: '', //组长
				team: [], //组员
			}
		},
		onLoad(option) {
			console.log(option)
			if (option.leader_name) {
				this.checked = true;
				this.check = false;
				let leader = option.leader_name
				let team_use = JSON.parse(option.team_use)
				let Leader_id = option.Leader_id
				this.groupLeaderName = leader; //需要显示的组长名
				this.groupLeader_id = Leader_id //往后台传的id
				this.crew = team_use;
				this.groupLeader = team_use;
				this.name = option.name;
				this.id = option.id;
				this.team = option.users_str;
				// console.log('组长',option.leader_name)
				// console.log("组长id",option.Leader_id)
				// console.log('组员',JSON.parse(option.team_use))
				// console.log('传过来的idzu',option.users_str)
			}
		},
		computed: {
			// 组长
			groupLeaderCount() {
				if (this.groupLeaderName) {
					return this.groupLeaderName
				} else {
					return this.index > 0 ? this.groupLeader[this.index].name : '请选择'
				}
			},
		},
		methods: {
			// 点击搜索搜索列表
			// handleClickSearch(e){
			// 	console.log(e);
			// 	this.getRecruitTeamList()
			// },
			// 请求用户列表
			async getRecruitTeamList() {
				// 发请求
				let url = this.ServicesApi.userList;
				let data = {
					name: this.name, //岗位类型名称
				};
				let result = await this.Services.post(url, data);
				if (result.code == this.StatusCode.SUCCESS_CODE) {
					this.groupLeader = result.data;
					// this.index = result.data.findIndex(i => i.id == this.groupLeader_id) > -1 ? this.groupLeader.findIndex(i => i.id === this.groupLeader_id) : 0;
				}

				// uni.request({
				//     url: this.ServicesApi.userList, 
				// 	method:'POST',
				// 	header: {
				// 		"content-type":"application/x-www-form-urlencoded"
				// 	},
				//     data: {
				// 		token:this.token,
				// 		name:this.name,
				//     },
				//     success: (res) => {
				// 		// console.log(res.data.data)
				// 		this.groupLeader = res.data.data;
				//     }
				// });
			},
			// 取token
			getToken() {
				try {
					const value = uni.getStorageSync('login_key');
					if (value) {
						this.token = value;
					}
				} catch (e) {
					// error
				}
			},
			// 请求组长数据
			async getUserList() {
				// console.log('没执行吧')
				// 发请求
				let url = this.ServicesApi.userList;
				let data = {
					// name: this.name,//岗位类型名称
				};
				let result = await this.Services.post(url, data);
				if (result.code == this.StatusCode.SUCCESS_CODE) {
					this.groupLeader = result.data;
					this.crew = result.data;
				}

			},
			// 点确定提交数据
			async handleClickYes() {
				var pages = getCurrentPages();
				var currPage = pages[pages.length - 1]; //当前页面
				var prevPage = pages[pages.length - 2]; //上一个页面
				//直接调用上一个页面的setData()方法，把数据存到上一个页面中去
				prevPage && prevPage.setData && prevPage.setData({
					isDoRefresh: true
				});
				// 发请求
				let url = this.ServicesApi.createEditRecruitTeam;
				let data = {
					name: this.name, //招聘小组名称
					has_user: 1, //当前平台是不是拥有用户，这个接口这里必须传1
					group_leader_id: this.groupLeader_id, //招聘组长id
					team: this.team, //组员id，最少要有1个team[]
					id: this.id || '',
				};
				if (!this.name) {
					return uni.showToast({
						icon: 'none',
						title: '请输入小组名称'
					});
				}
				if (!this.groupLeader_id) {
					return uni.showToast({
						icon: 'none',
						title: '请选择组长'
					});
				}
				if (this.team.length < 1) {
					return uni.showToast({
						icon: 'none',
						title: '请至少选择一名组员'
					});
				}
				let result = await this.Services.post(url, data);
				if (result.code == this.StatusCode.SUCCESS_CODE) {
					uni.showToast({
						icon: 'none',
						title: result.msg
					});
					setTimeout(() => {
						uni.navigateBack({
							delta: 1,
							animationType: 'pop-out',
							animationDuration: 200
						});
					}, 1500);
				} else {
					uni.showToast({
						icon: 'none',
						title: result.msg,
					});
				}
				// uni.request({
				// 	url: this.ServicesApi.createEditRecruitTeam,
				// 	method: 'POST',
				// 	header: {
				// 		"content-type": "application/x-www-form-urlencoded"
				// 	},
				// 	data: {
				// 		token: this.token,
				// 		name: this.name, //招聘小组名称
				// 		has_user: 1, //当前平台是不是拥有用户，这个接口这里必须传1
				// 		group_leader_id: this.groupLeader_id, //招聘组长id
				// 		team: this.team, //组员id，最少要有1个team[]
				// 		id: this.id || '',
				// 	},
				// 	success: (res) => {
				// 		// console.log(res.data)
				// 		if (res.data.code == 0) {
				// 			uni.showToast({
				// 				icon: 'none',
				// 				title: res.data.msg,
				// 			});
				// 			return false
				// 		} else {
				// 			// uni.navigateTo({
				// 			// 	url:'./stationManage'
				// 			// })
				// 			uni.navigateBack({
				// 				delta: 1,
				// 				animationType: 'pop-out',
				// 				animationDuration: 200
				// 			});
				// 			uni.showToast({
				// 				title: res.data.msg
				// 			});
				// 		}
				// 		// uni.navigateBack({
				// 		// 	delta: 1,
				// 		// 	animationType: 'pop-out',
				// 		// 	animationDuration: 200
				// 		// });
				// 	}
				// });
			},
			// 点取消返回上一页
			handleClickNo() {
				uni.navigateBack({
					delta: 1,
					animationType: 'pop-out',
					animationDuration: 200
				});
			},
			// 组长
			groupLeaderChange(e) {
				// console.log('改变组长执行了吗')
				this.groupLeaderName = '';
				uni.hideKeyboard();
					this.index = e.detail.value
				this.groupLeader_id = this.groupLeader[this.index].id
				// console.log(this.groupLeader_id)
			},
			// 多选
			checkboxChange(e) {
				// console.log(e)
				var items = this.crew;
				uni.hideKeyboard();
				var values = e.detail.value;
				// console.log(values)
				this.team = values;
				for (var i = 0, lenI = items.length; i < lenI; ++i) {
					const item = items[i]
					if (values.includes(item.value)) {
						this.$set(item, 'checked', true)
					} else {
						this.$set(item, 'checked', false)
					}
				}
			}
		},
		mounted() {
			// console.log(this.crew.length)
			if (this.crew.length == 0 || this.groupLeader.length == 0) {
				this.getUserList()
			};
			this.getRecruitTeamList()
		}
	}
</script>

<style scoped lang="stylus">
	.msg {
		height: 30upx;
		color: red;
	}

	.wrap {
		flex-wrap: wrap
	}

	.set-margin {
		margin: 20upx;
	}
	.input-item {
		height: 80rpx;
	}
	.flex-just {
		justify-content: space-around;
		margin: 30upx 0;

		.btn-yes {
			flex: 1;
			color: #fff;
			height: 100upx;
			font-size: 32rpx;
			text-align center;
			line-height 100upx;
			margin: 50rpx 60rpx;
			background: #0081FF;
		}

		.btn-no {
			height: 100upx;
			width: 340upx;
			background: #0081FF;
			color: #fff;
			text-align center;
			line-height 100upx;
		}
	}
</style>
